<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<%@ page language="java" pageEncoding="UTF-8"%>
<%@ include file="/foundation/ext/jsp/taglib.jsp"%>
<%@ include file="/foundation/ext/jsp/workspace.jsp"%>
<html>
<head>
	<title>用户管理</title>
	<link rel="stylesheet" type="text/css" href="<%=basePath%>foundation/ext/ext-plugins/lovcombo-1.0/css/Ext.ux.form.LovCombo.css"/>
	<script type="text/javascript" src="<%=basePath%>foundation/ext/ext-plugins/lovcombo-1.0/js/Ext.ux.form.LovCombo.js"></script>
	<script type="text/javascript" src="<%=basePath%>foundation/ext/ext-plugins/SearchField.js"></script>
	<script type="text/javascript" src="./ChangePwd.js"></script>
	<script type="text/javascript" src="./User.js"></script>
	
	<script type="text/javascript">
    var listUserUrl   	  	= sys.basePath + "systemuser/listUser.do";        
    var pageSize = Common.config.pageSize || 15;

    //数据字典
    var DataDict = {
    	sexArray	: <ncfw:dictWrite dicttypeId="T_PUB_USER_SEX" type="array"/>,
   		statusArray	: <ncfw:dictWrite dicttypeId="T_PUB_USER_STATUS" type="array"/>
   	};

   	//本地转化
   	var LocalRenderer = {
   		sex				: function (sex) {
			return Common.renderer.dictRender (DataDict.sexArray, sex);
   		},
   		status			: function (status) {
			return Common.renderer.dictRender (DataDict.statusArray, status);
   		}
   	}

   	//提交查询表单
   	var onSubmitQueryHandler = function () {
   	   	var thisForm = queryFormPanel.getForm();
   	   	if (!thisForm.isValid()) {
			return;
   	   	}
   	   	var store = dataGrid.getStore();
   	 	var queryType 		= Ext.getCmp("query.QueryType").getText();
		if (store.baseParams == null) {
			store.baseParams	= {};
		}
		switch (queryType) {
			case "登录名" 	: 	store.baseParams.loginIdLike 	= Ext.getCmp("query.SearchField").getValue(); 	break;
			case "姓名" 		: 	store.baseParams.userNameLike 	= Ext.getCmp("query.SearchField").getValue(); 	break;
			case "邮箱" 		: 	store.baseParams.mailAddrLike	= Ext.getCmp("query.SearchField").getValue(); 	break;
			case "联系电话" 	: 	store.baseParams.mobilePhoneLike= Ext.getCmp("query.SearchField").getValue(); 	break;
		}
   	 	store.reload({params:{start: 0, limit: pagingToolbar.pageSize}});
   	};

   	//重置查询表单
   	var onResetQueryHandler = function () {
   		var thisForm = queryFormPanel.getForm();
   		thisForm.reset();
   	}

   	var searchField = new Ext.ux.form.SearchField({id : 'query.SearchField', width: 160, emptyText:'请输入查询关键字', hideLabel: true});
   	searchField.onTrigger2Click = onSubmitQueryHandler;

	//初始化页面信息
	function initPage () {
		onSubmitQueryHandler();
	}
    </script>
</head>
  <body>
    <ext:ext onReady="initPage();">
	  	<ext:viewport layout="border" otherProperties="split: true" >
	  		<ext:items>
  				<ext:panel title="用户管理" region="center" layout="border" border="false" iconCls="icon_plugin">
  					<ext:items>
	   					<%-- 列表面板 --%>
	   					<ext:panel var="userListPanel" layout="border" border="false" otherProperties="split: true" region="center"
	   						margins="3 0 0 0">
	   						<ext:items>
	   							<%-------------------------------------------------------------------------------------------------
									定义查询条件面板  
								-------------------------------------------------------------------------------------------------%>
								<ext:formPanel var="queryFormPanel" id="queryFormPanel" collapsible="true" 
									labelAlign="left" frame="true" region="north" height="42" border="false" 
									labelWidth="58" otherProperties="split: true">
									<ext:items>
										<ext:container layout="column" defaults="{width: 260, layout: 'form'}" lazyInit="true">
											<ext:items>
												<ext:container lazyInit="true" xtype="panel" width="120">
													<ext:items>
														{xtype: 'tbbutton', id: 'query.QueryType', text : '登录名', minWidth: 100, menu : 
														new Ext.menu.Menu({
															width: 100,
															items : [{
																id: 'query.QueryTypeID',
																text : '登录名',
																handler: function () {
																	var QueryType = Ext.getCmp("query.QueryType");
																	QueryType.setText(Ext.getCmp("query.QueryTypeID").text);
																}
															},{
																id: 'query.QueryTypeCn',
																text : '姓名',
																handler: function () {
																	var QueryType = Ext.getCmp("query.QueryType");
																	QueryType.setText(Ext.getCmp("query.QueryTypeCn").text);
																}
															},{
																id: 'query.QueryTypeMobile',
																text : '联系电话',
																handler: function () {
													  				var QueryType = Ext.getCmp("query.QueryType");
													  				QueryType.setText(Ext.getCmp("query.QueryTypeMobile").text);
																}
															},{
																id: 'query.QueryTypeMail',
																text : '邮箱',
																handler: function () {
													  				var QueryType = Ext.getCmp("query.QueryType");
													  				QueryType.setText(Ext.getCmp("query.QueryTypeMail").text);
																}
															}]
														})}
													</ext:items>
												</ext:container>
												<ext:container lazyInit="true">
													<ext:items>
													searchField
													</ext:items>
												</ext:container>
											</ext:items>
										</ext:container>
										
									</ext:items>
								</ext:formPanel>
	   							<%-------------------------------------------------------------------------------------------------
									定义数据列表  
								-------------------------------------------------------------------------------------------------%>
								<ext:gridPanel var="dataGrid" id="dataGrid" region="center" iconCls="icon_grid" 
									border="true" otherProperties="split: true" iconCls="icon_grid" selModel="sm" loadMask="true"
									viewConfig="{forceFit: true}">
									<ext:tbar>
										<ext:toolbarSeparator></ext:toolbarSeparator>
										<ext:toolbarButton id="addBtn" text="新增" iconCls="icon_add" handler="User.onAdd"
											otherProperties="minWidth: Common.config.buttonWidth.minButton">
										</ext:toolbarButton>
										<ext:toolbarButton id="updateBtn" text="修改" iconCls="icon_edit" handler="User.onUpdate"
											otherProperties="minWidth: Common.config.buttonWidth.minButton">
										</ext:toolbarButton>
										<ext:toolbarButton id="deleteBtn" text="删除" iconCls="icon_delete" handler="User.onDelete"
											otherProperties="minWidth: Common.config.buttonWidth.minButton">
										</ext:toolbarButton>
										<ext:toolbarButton id="updatePwdBtn" text="密码修改" iconCls="icon_edit" handler="ChangePwd.onChangePwd"
											otherProperties="minWidth: Common.config.buttonWidth.minButton">
										</ext:toolbarButton>
										<ext:toolbarButton id="enableBtn" text="启用" iconCls="icon_sure" handler="User.enable"
											otherProperties="minWidth: Common.config.buttonWidth.minButton">
										</ext:toolbarButton>
										<ext:toolbarButton id="disableBtn" text="禁用" iconCls="icon_unUse" handler="User.disable"
											otherProperties="minWidth: Common.config.buttonWidth.minButton">
										</ext:toolbarButton>
									</ext:tbar>
									<%-- 定义数据源--%>
									<ext:store var="dataStore" remoteSort="true" sortInfo="{field: 'ORDERBY', direction: 'ASC'}"
										otherProperties="url: listUserUrl" >
										<ext:jsonReader root="result" totalProperty="totalCount"
											record="Ext.data.Record.create([
												{name : 'userId', type : 'string', mapping: 'userId'},
												{name : 'loginId', type : 'string', mapping: 'loginId'},
												{name : 'userName', type : 'string', mapping: 'userName'},
												{name : 'mobilePhone', type : 'string', mapping: 'mobilePhone'},
												{name : 'mailAddr', type : 'string', mapping: 'mailAddr'},
												{name : 'userSex', type : 'string', mapping: 'userSex'},
												{name : 'isavailability', type : 'string', mapping: 'isavailability'},
												{name : 'effectdateend', type : 'string', mapping: 'effectdateend'}
											])">
										</ext:jsonReader>
									</ext:store>
									<%-- 定义列表的列头--%>
									<ext:columnModel id="cm">
										<ext:rowNumberer></ext:rowNumberer>										
										<ext:checkboxSelectionModel var="sm"></ext:checkboxSelectionModel>,
										{header : '登录名', width: 100, dataIndex: 'loginId'},
										{header : '姓名', width: 100, dataIndex: 'userName'},
										{header : '联系电话', width: 100, dataIndex: 'mobilePhone'}, 
										{header : '邮箱', width: 180, dataIndex: 'mailAddr'},
										{header : '用户状态', width: 70, dataIndex: 'isavailability', renderer: LocalRenderer.status},
										{header : '失效日期', width: 100, dataIndex: 'effectdateend', renderer: Common.renderer.dateRender}
									</ext:columnModel>
									<%-- 定义列表的分页工具栏--%>
									<ext:pagingToolbar key="bbar" displayInfo="true"
										store="dataStore" var="pagingToolbar" otherProperties="pageSize: pageSize">
										<ext:plugins>new Ext.ux.Page.pageSize({beforeText : '显示', afterText : '条' })</ext:plugins>
									</ext:pagingToolbar>
								</ext:gridPanel>
	   						</ext:items>
	   					</ext:panel>
   					</ext:items>
   				</ext:panel>
	  			</ext:items>
	  	</ext:viewport>
    </ext:ext>
  </body>
  
</html>
